<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Hello MUI</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="../css/mui.min.css">
		<style>
			html,body {
				background-color: #efeff4;
			}
			.title{
				margin: 20px 15px 10px;
				color: #6d6d72;
				font-size: 15px;
			}
			 .oa-contact-cell.mui-table .mui-table-cell {
				padding: 11px 0;
				vertical-align: middle;
			}
			
			.oa-contact-cell {
				position: relative;
				margin: -11px 0;
			}
	
			.oa-contact-avatar {
				width: 75px;
			}
			.oa-contact-content {
				width: 100%;
			}
			.oa-contact-name {
				margin-right: 20px;
			}
			.oa-contact-name, oa-contact-position {
				float: left;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">管理员获取签到码列表</h1>
		</header>
		<div class="mui-content">
			<div class="title" style="height: 100%;display: none;"></div>
			<ul id="teachClassUl" class="mui-table-view mui-table-view-striped mui-table-view-condensed"></ul>
			<ul id="QRCodeUl" class="mui-table-view mui-table-view-striped mui-table-view-condensed" style="height: 100%;display: none;">
				<li style="text-align: center;">
					<img id="QRCodeImg" src="" style="height: 360px;border: solid 1px;"/>
				</li>
				<li style="text-align: center;">
					<button style="margin-bottom: 50px;margin-top: 50px;" onclick="toList()">返回列表</button>
				</li>
			</ul>
		</div>
	</body>
	<script type="text/javascript" src="../js/jquery1113.js"></script>
	<script src="../js/mui.min.js"></script>
	<script src="../js/data.js"></script>
	<script>
		mui.init({
			swipeBack:true //启用右滑关闭功能
		});
		
		mui.plusReady(function() {
			getMyManageTeachClass();
		});
		function getMyManageTeachClass(){
			
			var name = plus.storage.getItem('name');
			var password = plus.storage.getItem('password');
								
			if(name != null && name != '' && password != null && password != ''){
				
				var jsonObject = {};
				
				jsonObject['name'] = name;
				jsonObject['password'] = password;
				
				xhr = new plus.net.XMLHttpRequest();
				xhr.onreadystatechange = function() {
					switch (xhr.readyState) {
						case 4:
							if (xhr.status == 200) {
								var data = JSON.parse(xhr.responseText);
								if (data && data.result == 1) {
									var appendStr = "";
									$.each(data.data,function(index,item){
										if(item){
											appendStr += '<li class="mui-table-view-cell">'+
											'<div class="mui-slider-cell" onclick="getQRCode(\''+item.className+'\',\''+item.id+'\')">'+
											'<div class="oa-contact-cell mui-table">'+
											'<div class="oa-contact-avatar mui-table-cell">'+
											'<img style="width:60px;height:60px;" src="../images/teachClass.png" />'+
											'</div>'+
											'<div class="oa-contact-content mui-table-cell">'+
											'<div class="mui-clearfix">'+
											'<h4 class="oa-contact-name">'+item.className+'</h4>'+
											'<span class="oa-contact-position mui-h6">签到码</span>'+
											'</div>'+
											'<p class="oa-contact-email mui-h6">'+
											item.startDate+"~"+item.endDate+
											'</p>'+
											'</div>'+
											'</div>'+
											'</div>'+
											'</li>';
										}
									});
									$("#teachClassUl").html(appendStr);
								} else {
									mui.alert(data.message);
								}
									// console.log("xhr请求成功：" + xhr.readyState);
							} else {
								console.log("xhr请求失败：" + xhr.readyState);
							}
							break;
						default:
							break;
					}
				}
				xhr.open("POST", serverUrl + "teachClass/PubGetMyManageTeachClass.do");
				xhr.setRequestHeader("Content-Type", "application/json");
				xhr.send(JSON.stringify(jsonObject));
			}
		}
		
		function getQRCode(className,classId){
			
			var name = plus.storage.getItem('name');
			var password = plus.storage.getItem('password');
								
			if(name != null && name != '' && password != null && password != '' && classId != null && classId != ''){
				
				var jsonObject = {};
				
				jsonObject['name'] = name;
				jsonObject['password'] = password;
				jsonObject['classId'] = classId;
				
				xhr = new plus.net.XMLHttpRequest();
				xhr.onreadystatechange = function() {
					switch (xhr.readyState) {
						case 4:
							if (xhr.status == 200) {
								var data = JSON.parse(xhr.responseText);
								if (data && data.result == 1) {
									toQRCode(className,classId,data.data)
								} else {
									mui.alert(data.message);
								}
									// console.log("xhr请求成功：" + xhr.readyState);
							} else {
								console.log("xhr请求失败：" + xhr.readyState);
							}
							break;
						default:
							break;
					}
				}
				xhr.open("POST", serverUrl + "teachClass/PubGetStampByClassId.do");
				xhr.setRequestHeader("Content-Type", "application/json");
				xhr.send(JSON.stringify(jsonObject));
			}
		}
		
		
		function toQRCode(className,classId,QRCode){
			$("#teachClassUl").hide();
			$("#QRCodeImg").attr("src",QRCode);
			$("#QRCodeUl").show();
			$(".title:eq(0)").html(className+"扫码");
		}
		function toList(){
			$("#teachClassUl").show();
			$("#QRCodeUl").hide();
			$("#QRCodeImg").attr("src","");
			$(".title:eq(0)").html("管理员获取签到码列表");
		}
	</script>
</html>